/* eslint-disable react-hooks/exhaustive-deps */
/*
 * @Author: 周海 zhouhaib@yonyou.com
 * @Date: 2022-12-16 21:21:17
 * @LastEditors: zhouhai zhouhaib@yonyou.com
 * @LastEditTime: 2024-10-23 17:53:04
 */
import { addJobLog, delJobLog, updateJobLog } from '@/api/monitor/jobLog';
import BillCard from '@/components/BillCard';
import { useStore } from '@/store';
import { SysJobLogDomain } from '@/type.d/monitor/jobLog';
import { Button, Col, Form, Input, Modal, Row, Select, Space } from 'antd';
import React, { useEffect, useState } from 'react';

import './index.less';

interface SysJobLogCardProp {
                sysCommonStatusOptions: any[];
    /**
     * 卡片数据 受控
     */
    cardData: SysJobLogDomain;
    /**
     * 卡片新增时的默认数据
     */
    newdata?: SysJobLogDomain;
    /**
     * 列表数据
     */
    tableListDataSource: SysJobLogDomain[];
    /**
     * 更新列表数据
     */
    setTableListDataSource: (data: SysJobLogDomain[]) => void;

    setIsedit?: (isedit: boolean) => void;

    isedit?: boolean;
    /**
     * 跳转到列表状态
     */
    onBack?: (e?: React.MouseEvent<HTMLElement>) => void;
}
const SysJobLogCard: React.FC<SysJobLogCardProp> = ((props: SysJobLogCardProp) => {
    const {
        cardData,
        newdata = {},
        tableListDataSource,
        setTableListDataSource,
        setIsedit,
        isedit = false,
        onBack
    } = props;
    const {layoutStore} = useStore();
    const [selectdata, setSelectdata] = useState<SysJobLogDomain>(cardData);
    const [oldSelectdata, setOldSelectdata] = useState<SysJobLogDomain>({});//编辑状态临时保存选中的菜单树数据
    const [formRef] = Form.useForm<SysJobLogDomain>();

    const intCardData = (_cardData: SysJobLogDomain) => {
        setSelectdata(_cardData)
        setOldSelectdata({})
    }


    const addCardData = (_cardData: SysJobLogDomain) => {
        setSelectdata(_cardData)
        setOldSelectdata({...selectdata})
        setIsedit?.(true)
    }

    const editCardData = () => {
        setOldSelectdata({...selectdata})
        setIsedit?.(true)
    }

    const resetCardData = () => {
        setSelectdata({...oldSelectdata})
        setOldSelectdata({})
    }

    const onDelete = (dedata: SysJobLogDomain) => {
        if (dedata.jobLogId) {
            layoutStore.OpenSpanning()
            delJobLog(dedata.jobLogId).then(() => {
                setSelectdata({})
                setOldSelectdata({})
                setTableListDataSource(tableListDataSource.filter((item) => {
                    return item.jobLogId !== dedata.jobLogId
                }))
            }).finally(() => {
                layoutStore.CloseSpanning()
            })
        }

    }

    useEffect(() => {//从列表跳转到卡片，如果数据发生了变化，更新数据
        intCardData(cardData)
    }, [])


    useEffect(() => {
        formRef.resetFields()
        if (selectdata) {
            formRef?.setFieldsValue({...selectdata});
        } else {
            formRef?.setFieldsValue({});
        }
    }, [selectdata])


    /**
     * 表单字段配置
     */
    const cardItems: JSX.Element =
        <Row>
                <Col md={8} xl={6} hidden>
                <Form.Item
                    name="jobLogId"
                    label="任务日志ID"
                >
                    <Input/>
                </Form.Item>
                </Col>
                <Col md={8} xl={6} >
                <Form.Item
                    name="jobName"
                    label="任务名称"
                    rules={[{
                        required: true,
                        message: '此项为必填项',
                    }]}
                >
                    <Input/>
                </Form.Item>
                </Col>
                <Col md={8} xl={6} >
                <Form.Item
                    name="jobGroup"
                    label="任务组名"
                    rules={[{
                        required: true,
                        message: '此项为必填项',
                    }]}
                >
                    <Input/>
                </Form.Item>
                </Col>
                <Col md={24} xl={24} >
                <Form.Item
                    name="invokeTarget"
                    label="调用目标字符串"
                    rules={[{
                        required: true,
                        message: '此项为必填项',
                    }]}
                >
                    <Input.TextArea />
                </Form.Item>
                </Col>
                <Col md={24} xl={24} >
                <Form.Item
                    name="jobMessage"
                    label="日志信息"
                >
                    <Input.TextArea />
                </Form.Item>
                </Col>
                <Col md={8} xl={6} >
                <Form.Item
                    name="status"
                    label="执行状态"
                >
                    <Select options={props.sysCommonStatusOptions} />
                </Form.Item>
                </Col>
                <Col md={24} xl={24} >
                <Form.Item
                    name="exceptionInfo"
                    label="异常信息"
                >
                    <Input.TextArea />
                </Form.Item>
                </Col>
                <Col md={8} xl={6} hidden>
                <Form.Item
                    name="createBy"
                    label="创建者"
                >
                    <Input/>
                </Form.Item>
                </Col>
                <Col md={8} xl={6} hidden>
                <Form.Item
                    name="createTime"
                    label="创建时间"
                >
                    <Input/>
                </Form.Item>
                </Col>
                <Col md={8} xl={6} >
                <Form.Item
                    name="updateBy"
                    label="更新者"
                >
                    <Input/>
                </Form.Item>
                </Col>
                <Col md={8} xl={6} >
                <Form.Item
                    name="updateTime"
                    label="更新时间"
                >
                    <Input/>
                </Form.Item>
                </Col>
                <Col md={8} xl={6} >
                <Form.Item
                    name="remark"
                    label="备注"
                >
                    <Input/>
                </Form.Item>
                </Col>
        </Row>
;


const cardbuttons = (
    <Space>
        <Button
            size='small'
            key="add"
            type="primary"
            onClick={() => {
                addCardData({...newdata})
            }}
        >
            新增
        </Button>
        <Button
            size='small'
            key="edit"
            type="primary"
            disabled={selectdata?.jobLogId ? false : true}
            onClick={() => {
                editCardData()
            }}
        >
            修改
        </Button>
        <Button
            size='small'
            key="delete"
            type="primary"
            disabled={selectdata?.jobLogId ? false : true}
            onClick={() => {
                Modal.confirm({
                        okText: '确定',
                        cancelText: '取消',
                        title: '系统提示',
                        content: '确定要删除数据吗？',
                        type: 'warning',
                        onOk: () => {
                            onDelete(selectdata)
                        }
                    }
                )

            }}
        >
            删除
        </Button>
    </Space>
)

const onSave = () =>
    {
        formRef.validateFields().then(() => {
            const data: SysJobLogDomain = formRef.getFieldsValue?.() || {};
            if (!selectdata.jobLogId) {//新增
                layoutStore.OpenSpanning()
                addJobLog({...selectdata, ...data}).then((res) => {
                    intCardData(res.data)//更新卡片数据
                    tableListDataSource.push(res.data)
                    setTableListDataSource([...tableListDataSource])
                    setIsedit?.(false)
                }).finally(() => {
                    layoutStore.CloseSpanning()
                })
            } else {//更新
                layoutStore.OpenSpanning()
                updateJobLog({...selectdata, ...data}).then((res) => {
                    intCardData(res.data)//更新卡片数据
                    setTableListDataSource(tableListDataSource.map((item) => {
                        if (item.jobLogId === res.data.jobLogId) {
                            return res.data
                        } else {
                            return item
                        }
                    }))
                    setIsedit?.(false)
                }).finally(() => {
                    layoutStore.CloseSpanning()
                })
            }
        })
    }


const editbuttions = (
    <Space>
        <Button
            size='small'
            key="save"
            type="primary"
            onClick={() => {
                onSave()
            }}
        >
            保存
        </Button>
        <Button
            size='small'
            key="cancel"
            type="primary"
            onClick={() => {
                resetCardData()
                setIsedit?.(false)
            }}
        >
            取消
        </Button>
    </Space>
)

return (
    <BillCard
        formid='jobLogId'
        key={'SysJobLogCard'}
        formRef={formRef}
        isedit={isedit}
        extraButton={isedit ? editbuttions : cardbuttons}
        onBack={onBack}
        title={'定时任务调度日志'}
        cardItem={cardItems}
    />
)
})
export default SysJobLogCard;